<!--
* @description 消防通道
* @author zywu
* @date 2021/01/09 10:51:30
!-->
<template>
	<div class="fire-passage">
		<div class="content-top-title">
			<p class="title-text">消防通道监测回顾</p>
		</div>
		<div class="statistics-quantity statistics-two">
			<div>
				<div class="statistics-number">
					<span>{{reportData.totalAlarmOrg}}</span>
					<p>报警单位总数</p>
				</div>
				<div class="statistics-Allnumber">
					<span style="color: rgb(250, 124, 90);">{{reportData.totalContinueTimeStr}}</span>
					<p>消防通道报警总时长</p>
				</div>
			</div>
		</div>
		<div v-if="dataList.length>0" class="keyIssues-leaderboard" id="firePassage_box">
			<div class="content-detail-title">
				<img src="/ilink-app-h5-zd/static/img/ilink_1565765076954.png" style="vertical-align:middle;width:25px;height:25px;margin-top: -5px;">单位消防通道报警时长排名
			</div>
			<ul id="firePassage">
				<li v-for="(item,i) in dataList" :key="i">
					<div class="item-number">
						<div class="item-num-div">{{i+1}}</div>
					</div>
					<div class="item-content">
						<div>{{item.orgName}}</div>
						<div style="float: right;">{{item.continueTimeStr}}</div>
					</div>
				</li>
			</ul>
		</div>
	</div>
</template>

<script>
export default {
	props: {
		reportData: {
			type: Object,
			default: function () {
				return {}
			},
		},
		period: {
			type: [Number, String],
			default: '',
		},
		periodName: {
			type: String,
			default: '',
		},
	},
	data() {
		return {
			dataList: [],
		}
	},

	components: {},

	computed: {},

	created() {
		this.dataList = this.reportData.dataList || []
	},

	mounted() {},

	methods: {},
}
</script>
<style lang='scss'>
</style>